/*
WPCom Global theme, Modern theme adjusted for use in calypso non site contexts
*/

.color-scheme.is-global {
	/* Variables used in Calypso Modern */
	--theme-text-color: #fff; /* Direct from wp-admin */
	--theme-base-color: #1e1e1e; /* Direct from wp-admin */
	--theme-submenu-text-color: #bcbcbc; /* mix( $base-color, $text-color, 30% ) */
	--theme-submenu-background-color: #0c0c0c; /* darken( $base-color, 7% ), computed: http://scg.ar-ch.org/ */
	--theme-icon-color: #ece6f6; /* Direct from wp-admin */
	--theme-highlight-color: #3858e9; /* Direct from wp-admin */
	--theme-notification-color: var(--studio-wordpress-blue-20);

	/* Theme highlight monochromatic palette */
	--theme-highlight-color-0: #d5dffa;
	--theme-highlight-color-5: #d7defa;
	--theme-highlight-color-10: #abc0f5;
	--theme-highlight-color-20: #82a1f0;
	--theme-highlight-color-30: #5882eb;
	--theme-highlight-color-40: #2f63e6;
	--theme-highlight-color-50: var(--theme-highlight-color);
	--theme-highlight-color-60: #2145e6; /* Direct from Gutenberg */
	--theme-highlight-color-70: #133ca6;
	--theme-highlight-color-80: #0e2d7c;
	--theme-highlight-color-90: #091e53;
	--theme-highlight-color-100: #040f29;
	--color-link: var(--theme-highlight-color);
	--color-link-dark: var(--theme-highlight-color-70);
	--color-link-light: var(--theme-highlight-color-30);

	/* Primary */
	--color-primary: var(--theme-highlight-color);
	--color-primary-dark: var(--theme-highlight-color-70);
	--color-primary-light: var(--theme-highlight-color-30);
	--color-primary-0: var(--theme-highlight-color-0);
	--color-primary-5: var(--theme-highlight-color-5);
	--color-primary-10: var(--theme-highlight-color-10);
	--color-primary-20: var(--theme-highlight-color-20);
	--color-primary-30: var(--theme-highlight-color-30);
	--color-primary-40: var(--theme-highlight-color-40);
	--color-primary-50: var(--theme-highlight-color-50);
	--color-primary-60: var(--theme-highlight-color-60);
	--color-primary-70: var(--theme-highlight-color-70);
	--color-primary-80: var(--theme-highlight-color-80);
	--color-primary-90: var(--theme-highlight-color-90);
	--color-primary-100: var(--theme-highlight-color-100);
	--color-accent: var(--theme-highlight-color);
	--color-accent-dark: var(--theme-highlight-color-70);
	--color-accent-light: var(--theme-highlight-color-30);
	--color-accent-0: var(--theme-highlight-color-0);
	--color-accent-5: var(--theme-highlight-color-5);
	--color-accent-10: var(--theme-highlight-color-10);
	--color-accent-20: var(--theme-highlight-color-20);
	--color-accent-30: var(--theme-highlight-color-30);
	--color-accent-40: var(--theme-highlight-color-40);
	--color-accent-50: var(--theme-highlight-color-50);
	--color-accent-60: var(--theme-highlight-color-60);
	--color-accent-70: var(--theme-highlight-color-70);
	--color-accent-80: var(--theme-highlight-color-80);
	--color-accent-90: var(--theme-highlight-color-90);
	--color-accent-100: var(--theme-highlight-color-100);
	--color-masterbar-background: var(--theme-base-color);
	--color-masterbar-border: var(--theme-submenu-background-color);
	--color-masterbar-text: var(--theme-text-color);
	--color-masterbar-icon: var(--theme-icon-color);
	--color-masterbar-highlight: var(--theme-text-color);
	--color-masterbar-unread-dot-background: var(--theme-notification-color);
	--color-masterbar-item-hover-background: var(--theme-submenu-background-color);
	--color-masterbar-item-active-background: var(--theme-submenu-background-color);
	--color-masterbar-submenu-text: var(--studio-gray-10);
	--color-masterbar-submenu-hover-text: var(--theme-text-color);

	--color-masterbar-item-new-editor-background: var(--studio-gray-50);
	--color-masterbar-item-new-editor-hover-background: var(--studio-gray-60);

	--color-masterbar-toggle-drafts-editor-background: var(--studio-gray-60);
	--color-masterbar-toggle-drafts-editor-hover-background: var(--studio-gray-40);
	--color-masterbar-toggle-drafts-editor-border: var(--studio-gray-10);

	/* Sidebar */
	--color-sidebar-background: var(--theme-base-color);
	--color-sidebar-border: var(--theme-submenu-background-color);
	--color-sidebar-text: var(--theme-text-color);
	--color-sidebar-text-alternative: var(--studio-gray-10);
	--color-sidebar-gridicon-fill: var(--studio-gray-0);

	/* Sidebar Selected */
	--color-sidebar-menu-selected-background: var(--theme-highlight-color);
	--color-sidebar-menu-selected-text: var(--theme-text-color);
	--color-sidebar-menu-hover-background: var(--theme-highlight-color);
	--color-sidebar-menu-hover-text: var(--theme-text-color);

	/* Sidebar Submenu - Nav Unification */
	--color-sidebar-submenu-background: var(--theme-submenu-background-color);
	--color-sidebar-submenu-text: var(--theme-submenu-text-color);
	--color-sidebar-submenu-hover-background: transparent;
	--color-sidebar-submenu-hover-text: var(--theme-highlight-color); /* $menu-submenu-focus-text */
	--color-sidebar-submenu-selected-hover-text: var(--color-sidebar-submenu-hover-text);

	/* Sidebar Submenu - Nav Redesign */
	--color-navredesign-sidebar-submenu-text: var(--color-sidebar-submenu-text);
	--color-navredesign-sidebar-menu-selected-text: var(--theme-text-color);
	--color-navredesign-sidebar-submenu-selected-text: var(--theme-text-color);
	--color-navredesign-sidebar-submenu-hover-text: var(--theme-highlight-color); /* $menu-submenu-focus-text */
	--color-navredesign-sidebar-submenu-selected-hover-text: var(--color-sidebar-submenu-hover-text);

	/* Gutenberg components */
	--wp-admin-theme-color: var(--color-accent);
	--wp-admin-theme-color-darker-20: var(--color-accent-60);
}
